import { defineStore } from "pinia";
import { getToken, removeToken, setToken } from "../utils/token-utils";
import type { UserInfoState } from "./interface";
import { staticRoutes } from "@/router/routes";
import { loginApi, logoutApi, getUserInfoApi } from "@/api/acl/login";

/**
 * 用户信息
 * @methods setUserInfos 设置用户信息
 */
export const useUserInfoStore = defineStore("userInfo", {
  state: (): UserInfoState => ({
    token: getToken() as string,
    name: "", // 用户名
    avatar: "", // 用户头像
    routes: [], // 路由权限列表：决定哪些路由组件可以访问
    buttons: [], // 按钮权限列表：决定哪些按钮可以访问
    menuRoutes: [], // 菜单权限列表
  }),

  actions: {
    // 登录
    async login(username: string, password: string) {
      // 发送请求登录
      const { token } = await loginApi(username, password);
      // 登录成功将token存储起来
      // token将来就会在请求拦截器使用
      this.token = token; // 存在pinia中（方便各个地方都可以使用）
      setToken(token); // 存在localStorage中（持久化存储，下次刷新数据还在）
    },
    // 登出
    async reset() {
      // 删除服务器的token
      await logoutApi();
      // 删除local中保存的token
      removeToken();
      // 删除pinia中的数据
      this.token = "";
      this.name = "";
      this.avatar = "";
    },
     /*
      登录成功，获取用户信息展示
      将来刷新首页/品牌管理/...，获取用户信息展示

      解决：在路由导航守卫完成
        登录成功，跳转到其他页面，触发路由导航守卫
        刷新页面，触发路由导航守卫
    */
    // 获取用户信息
    async getInfo() {
      const { name, avatar, buttons, routes } = await getUserInfoApi();
      // 用户名和头像在头部展示
      this.name = name;
      this.avatar = avatar;
      // 用来权限管理
      this.buttons = buttons;
      this.routes = routes;

      // 左侧菜单要渲染的路由表
      this.menuRoutes = staticRoutes;
    },
  },
});
